@extends('user.layouts.head')
@section('content')
    <body>
    <div id="app">
        <div class="wrapper -header-fixed">

        @include('user.layouts.navbar')
        @include('user.layouts.sidebar')

        <!-- 内容页开始-->
            <div class="content-container">
                <div class="container-fluid">
                    <div class="page-content">

                        <nav aria-label="breadcrumb">
                            <ol class="breadcrumb">
                                <li class="breadcrumb-item"><a href="{{ route('dashboard') }}">仪表盘</a></li>
                                <li class="breadcrumb-item"><a href="{{ route('banner.index') }}">查看位置</a></li>
                                <li class="breadcrumb-item active" aria-current="page">横幅设置</li>
                            </ol>
                        </nav>

                        <div class="card">
                            <div class="card-body">
                                <div class="row">

                                    <div class="col-lg-12">
                                        <div class="col-lg-9">
                                            <div class="card-img">
                                                <img src="{{@$image->image}}" height="35" class="card-img-top">
                                            </div>
                                        </div>
                                        <div class="card-body">
                                            <div class="form-group">
                                                <label>图片URL：</label>
                                                <input type="text" class="form-control" id="image"
                                                       value="{{@$image->image}}" placeholder="请填写图片URL地址" required>
                                                <p class="card-text">
                                                    <small class="text-danger">注意：图片大小必须是 1000X35, URL必须以http:// 或
                                                        https:// 开头
                                                    </small>
                                                </p>
                                            </div>
                                            <div class="form-group">
                                                <label>链接URL：</label>
                                                <input type="text" class="form-control" id="url"
                                                       value="{{@$image->url}}" placeholder="请填写跳转URL地址" required>
                                                <p class="card-text">
                                                    <small class="text-danger">注意：URL必须以http:// 或 https:// 开头</small>
                                                </p>
                                            </div>
                                            <button class="btn btn-primary" onclick="operation_tip()">提交</button>
                                        </div>
                                    </div>

                                </div> <!-- .row -->
                            </div> <!-- .card-body -->
                        </div> <!-- .card -->

                    </div> <!-- .page-content -->
                </div> <!-- .container-fluid -->
            </div> <!-- .content-container -->
        </div> <!-- .wrapper -->
    </div> <!-- #app -->
    <script src="{{ mix('js/app.js') }}"></script>
    <script src="{{ asset('/js/main.js') }}"></script>
    <script>

        let isLoading = false;

        // 提交
        function submit() {
            if ($('#image').val() === '') {
                toast('横幅图片地址 不能为空');
                return false
            }
            if ($('#url').val() === '') {
                toast('横幅跳转地址 不能为空');
                return false
            }

            if (isLoading === false) {
                isLoading = true;
                axios.post('{{ route('banner.image.store') }}', {
                    image: $('#image').val(),
                    url: $('#url').val()
                })
                    .then(function (response) {
                        isLoading = false;
                        toast_tip2(response.data.message, '{{ route('banner.image') }}');
                    })
                    .catch(function (error) {
                        isLoading = false;
                        $.each(error.response.data.errors, function (index, object) {
                            toast(object[0]);
                            return false;
                        });
                    })
            }

        }
    </script>

    </body>

@endsection
